<template>
	<view class="main" v-if="isLoading">
		<custom @showTopDailog="showTopDailog"></custom>
		<view class="main_containers">
			<pageTitle name="购票指南" :navBarArr="navBarArr"></pageTitle>
			<!-- 折叠内容 -->
			<view class="collapseContainers">
				<l-collapse :accordion="true">
					<l-collapse-item  v-for="(item, index) in collapseArr" :key="index" :title="item.title" :open="currIndex==index">
						<view class="content" v-html="item.content">
							
						</view>
					</l-collapse-item>
					
				</l-collapse>
			</view>
		</view>
		<footerContainer></footerContainer>
		<!-- 弹窗 -->
		<topDailog v-if="topDailogStatus" @closed="topDailogStatus=false"></topDailog>

	</view>
</template>

<script>
	import topDailog from '@/components/common/topDailog.vue';
	import footerContainer from '@/components/common/footer.vue';
	import pageTitle from '@/components/common/pageTitle.vue';
	import lCollapse from '@/components/common/l-collapse/l-collapse.vue';
	import lCollapseItem from '@/components/common/l-collapse-item/l-collapse-item.vue';
	import {
		mapMutations
	} from 'vuex'


	export default {
		components: {
			topDailog,
			footerContainer,
			pageTitle,
			lCollapse,
			lCollapseItem
		},
		data() {
			return {
				isLoading:false,
				currIndex:0,
				topDailogStatus: false,
				navBarArr: [{
						id: '1',
						name: "首页"
					},
					{
						id: '2',
						name: "票务中心"
					}
				],
				collapseArr: [{
						id: 1,
						title: '官方购票链接+座位图',
						content: '<text class="text_11">官方购票链接：www.taobao.com</text><image class = "image_5" mode="widthFix" src ="/static/content4.png"/>'
					},
					
				]

			}
		},
		onShow() {
           this.isLoading=true
		},
		onLoad(options) {
			let _this = this

		},
		onReady() {


		},
		methods: {
			showTopDailog() {
				this.topDailogStatus = true
			}
		},
	}
</script>

<style scoped lang="scss">
	.main {
		min-height: 100vh;
		position: relative;
		padding-bottom: 320rpx;
		background-image: url("../../static/bg_middle.png");
		background-size: 100% 100%;
		.collapseContainers{
			padding:20rpx 32rpx;
		}
	}
</style>